<template>
	<view class="">
		<u-tabs :list="list1" @click="click"></u-tabs>
		<view class="classPng" v-if="name=='班级介绍'">
			<!-- <image src="../../../static/portfolio/class.png" mode=""></image> -->
			<view class="picture" @click="selectImg">
				<image :src="picture" mode=""></image>
			</view>
			<view class="text" @click="addText">
				{{text}}
			</view>
		</view>
		<u-popup :show="show" mode="bottom"  @close="close" @open="open">
		        <view>
		            <textarea name="" id="" cols="30" rows="10"></textarea>
		        </view>
		</u-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				name:'班级介绍',
				 show: false,
                list1: [{
                    name: '班级介绍',
                }, {
                    name: '我的老师',
                },],
				picture:'../../../static/portfolio/classP.jpg',
				text:'亲爱的孩子们，你们是世界的未来，每一个笑容，每一个困惑，都是属于孩子们的独特旅程,你们在幼儿园的日子里，愿你们享受并珍惜每一刻。'
			}
		},
		methods: {
            click(item) {
                console.log('item', item);
				this.name=item.name
            },
			selectImg(){
				let that=this;
				uni.chooseMedia({
				  count: 1,
				  mediaType: ['image',],
				  sourceType: ['album', 'camera'],
				  success(res) {
					that.picture=res.tempFiles[0].tempFilePath
				    console.log(res.tempFiles[0].tempFilePath)
				  }
				})
			},
			addText(){
				this.show=true;
			},
			 open() {
			        // console.log('open');
			      },
			      close() {
			        this.show = false
			        // console.log('close');
			      }
		}
	}
</script>

<style lang="less" scoped>
	/deep/.u-tabs__wrapper__nav__item{
		flex: 1;
	}
	.classPng{
		margin-top: 10px;
		height: 400px;
		text-align: center;
		position: relative;
		// 310 210
		image{
			width: 85%;
			height: 100%;
		}
		.picture{
			width: 65%;
			height: 137px;
			position: absolute;
			left: 18%;
			top: 85px;
			image{
				width: 100%;
				height: 100%;
			}
		}
		.text{
			position: absolute;
			left: 18%;
			top: 240px;
			// background-color: aquamarine;
			width: 65%;
			height: 137px;
			line-height: 21px;
			font-size: 10px;
			overflow: hidden;
		}
	}
</style>